<template>
    <el-form label-width="auto">
        <el-form-item label="是否异步执行">
            <el-radio-group v-model="actionList[0].isAsyncAction">
                <el-radio :label="true">是</el-radio>
                <el-radio :label="false">否</el-radio>
            </el-radio-group>
        </el-form-item>
        <el-collapse>
            <el-collapse-item :name="index" v-for="(item, index) in actionList" style="border: 1px solid #b1b3b8">
                <template #title>
                    <div class="collapseTitle">
                        <span>行为 {{(index + 1)}}</span>
                        <el-button type="danger" plain size="small" style="margin-left: 20px" @click.stop="deleteAction(index)">删除</el-button>
                    </div>
                </template>
                <el-form-item label="参数类型">
                    <el-radio-group v-model="item.type">
                        <el-radio label="variable">关联变量</el-radio>
                        <el-radio label="api">服务调用</el-radio>
                        <el-radio label="route">路由跳转</el-radio>
                        <el-radio label="windowRoute">页面跳转</el-radio>
                        <el-radio label="thirdExec">三方服务</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="三方服务编码" v-if="item.type === 'thirdExec'">
                    <el-select v-model="item.realThirdExecCode" placeholder="三方服务编码" clearable style="width: 100%"
                               @change="thirdExecRealChange(item.realThirdExecCode, item)"
                               @clear="thirdExecRealClear(item)">
                        <el-option v-for="info in thirdExecList" :label="info.code" :value="info.code"/>
                    </el-select>
                </el-form-item>
                <el-form-item label="参数配置" v-if="item.type === 'thirdExec'">
                    <el-table :data="item.realExecParamJson ? item.realExecParamJson : []" :border="true"
                              :stripe="true"
                              :show-overflow-tooltip="true"
                              :max-height="200"
                              style="width: 100%;">
                        <el-table-column prop="name" label="字段名称"></el-table-column>
                        <el-table-column prop="type" label="字段类型"></el-table-column>
                        <el-table-column prop="description" label="字段描述"></el-table-column>
                        <el-table-column prop="value" label="字段值">
                            <template #default="scope">
                                <el-input v-model="scope.row.showInfo" @click="valueClick(scope, item.realExecParamJson)"/>
                            </template>
                        </el-table-column>
                    </el-table>
                </el-form-item>

                <div style="display: flex; justify-content: center; align-items: center; margin-top: 3%;" v-if="item.type === 'thirdExec'">
                    <el-button type="primary" class="addCollapse" size="small" @click="addResponseVariable(item)">添加响应出参映射</el-button>
                </div>

                <el-form label-width="auto" style="width: 100%" v-if="item.type === 'thirdExec'">
                    <el-collapse>
                        <el-collapse-item :name="paramIndex" v-for="(paramItem, paramIndex) in item.apiResponseList">
                            <template #title>
                                <div class="collapseTitle">
                                    <span>参数 {{(paramIndex + 1)}}</span>
                                    <el-button type="danger" plain size="small" style="margin-left: 20px" @click.stop="deleteResponseVariable(item, paramIndex)">删除</el-button>
                                </div>
                            </template>
                            <el-form-item label="参数名称">
                                <el-select v-model="paramItem.variableName" placeholder="参数名称" style="width: 100%">
                                    <el-option v-for="info in commonParam" :label="info.variableName" :value="info.variableName" />
                                </el-select>
                            </el-form-item>

                            <el-form-item label="参数值">
                                <el-input v-model="paramItem.variableValue" style="width: 100%" placeholder="参数值jsonPath"/>
                            </el-form-item>
                        </el-collapse-item>
                    </el-collapse>
                </el-form>





                <el-form-item label="是否添加前置服务" v-if="item.type === 'api' || item.type === 'route' || item.type === 'windowRoute'">
                    <el-radio-group v-model="item.isAddBeforeThirdExec">
                        <el-radio :label="true">是</el-radio>
                        <el-radio :label="false">否</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-divider v-if="item.isAddBeforeThirdExec && (item.type === 'api' || item.type === 'route' || item.type === 'windowRoute')"></el-divider>
                <el-alert v-if="item.isAddBeforeThirdExec && (item.type === 'api' || item.type === 'route' || item.type === 'windowRoute')" title="前置服务只对 服务调用/路由跳转/页面跳转 功能生效" type="info" center show-icon :closable="false"/>
                <br />
                <el-form-item label="三方服务编码" v-if="item.isAddBeforeThirdExec && (item.type === 'api' || item.type === 'route' || item.type === 'windowRoute')">
                    <el-select v-model="item.beforeThirdExecCode" placeholder="三方服务编码" clearable style="width: 100%"
                               @change="thirdExecBeforeChange(item.beforeThirdExecCode, item)"
                               @clear="thirdExecBeforeClear(item)">
                        <el-option v-for="info in thirdExecList" :label="info.code" :value="info.code"/>
                    </el-select>
                </el-form-item>
                <el-form-item label="参数配置" v-if="item.isAddBeforeThirdExec && (item.type === 'api' || item.type === 'route' || item.type === 'windowRoute')">
                    <el-table :data="item.beforeExecParamJson ? item.beforeExecParamJson : []" :border="true"
                              :stripe="true"
                              :show-overflow-tooltip="true"
                              :max-height="200"
                              style="width: 100%;">
                        <el-table-column prop="name" label="字段名称"></el-table-column>
                        <el-table-column prop="type" label="字段类型"></el-table-column>
                        <el-table-column prop="description" label="字段描述"></el-table-column>
                        <el-table-column prop="value" label="字段值">
                            <template #default="scope">
                                <el-input v-model="scope.row.showInfo" @click="valueClick(scope, item.beforeExecParamJson)"/>
                            </template>
                        </el-table-column>
                    </el-table>
                </el-form-item>
                <el-divider v-if="item.isAddBeforeThirdExec && (item.type === 'api' || item.type === 'route' || item.type === 'windowRoute')"></el-divider>
                <el-form-item label="变量名称" v-if="item.type === 'variable'">
                    <el-select v-model="item.variableParamName" placeholder="变量名称" style="width: 100%">
                        <el-option v-for="info in commonParam" :label="info.variableName" :value="info.variableName" />
                    </el-select>
                </el-form-item>
                <el-form-item label="参数值"  v-if="item.type === 'variable'">
                    <el-input v-model="item.variableValue" style="width: 100%"/>
                </el-form-item>


                <el-form-item label="服务调用输入类型" v-if="item.type === 'api'">
                    <el-radio-group v-model="item.apiInfoType">
                        <el-radio label="CUSTOM">自定义</el-radio>
                        <el-radio label="API-SERVICE">接口服务模板</el-radio>
                    </el-radio-group>
                </el-form-item>

                <el-form-item label="模板名称" v-if="item.type === 'api' && item.apiInfoType === 'API-SERVICE'">
                    <el-cascader :props="templateProps" @change="apiServiceTemplateChange($event, item)" style="width: 100%"/>
                </el-form-item>

                <el-form-item label="调用方式" v-if="item.type === 'api'">
                    <!-- MSSA Microsoft Service Share Api -->
                    <!-- MSOA Microsoft Service Owned Api -->
                    <!-- RTSA RestTemplate Service Share Api -->
                    <el-radio-group v-model="item.apiType">
                        <el-radio label="MSSA">微服务共享API</el-radio>
                        <el-radio label="MSOA">微服务自有API</el-radio>
                        <el-radio label="RTSA">通用透传API</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="服务地址" v-if="item.type === 'api'">
                    <el-input v-model="item.apiPath" style="width: 100%" placeholder="文本内容" />
                </el-form-item>

                <el-form-item label="请求方式" v-if="item.type === 'api'">
                    <el-radio-group v-model="item.apiMethod">
                        <el-radio label="GET">GET请求</el-radio>
                        <el-radio label="POST">POST请求</el-radio>
                    </el-radio-group>
                </el-form-item>

                <el-form-item label="响应类型" v-if="item.type === 'api'">
                    <el-radio-group v-model="item.responseType">
                        <el-radio label="defalut">默认</el-radio>
                        <el-radio label="blob">blob</el-radio>
                    </el-radio-group>
                </el-form-item>

                <div style="display: flex; justify-content: center; align-items: center; margin-top: 3%;" v-if="item.type === 'api' && item.isAddBeforeThirdExec === false">
                    <el-button type="primary" class="addCollapse" size="small" @click="addRequestVariable(item)">添加请求入参</el-button>
                </div>

                <el-form label-width="auto" style="width: 100%" v-if="item.type === 'api'">
                    <el-collapse>
                        <el-collapse-item :name="paramIndex" v-for="(paramItem, paramIndex) in item.apiParamList">
                            <template #title>
                                <div class="collapseTitle">
                                    <span>参数 {{(paramIndex + 1)}}</span>
                                    <el-button type="danger" plain size="small" style="margin-left: 20px" @click.stop="deleteRequestVariable(item, paramIndex)">删除</el-button>
                                </div>
                            </template>
                            <el-form-item label="参数类型">
                                <el-radio-group v-model="paramItem.type">
                                    <el-radio label="custom">自定义</el-radio>
                                    <el-radio label="variable">关联变量</el-radio>
                                    <el-radio label="urlQuery">URL地址变量</el-radio>
                                </el-radio-group>
                            </el-form-item>
                            <el-form-item label="参数名称">
                                <el-input v-model="paramItem.variableName" style="width: 100%"/>
                            </el-form-item>
                            <el-form-item label="参数值" v-if="paramItem.type === 'custom'">
                                <el-input v-model="paramItem.variableValue" style="width: 100%">
                                    <template #prepend>
                                        <el-select v-model="paramItem.variableType" placeholder="Select" style="width: 115px">
                                            <el-option label="字符串" value="String" />
                                            <el-option label="数组" value="Array" />
                                            <el-option label="对象" value="Object" />
                                        </el-select>
                                    </template>
                                </el-input>
                            </el-form-item>

                            <el-form-item label="URL地址参数名称" v-if="paramItem.type === 'urlQuery'">
                                <el-input v-model="paramItem.variableValue" style="width: 100%" />
                            </el-form-item>

                            <el-form-item label="变量名称" v-if="paramItem.type === 'variable'">
                                <el-select v-model="paramItem.variableParamName" placeholder="变量名称" style="width: 100%">
                                    <el-option v-for="info in commonParam" :label="info.variableName" :value="info.variableName" />
                                </el-select>
                            </el-form-item>
                        </el-collapse-item>
                    </el-collapse>
                </el-form>

                <div style="display: flex; justify-content: center; align-items: center; margin-top: 3%;" v-if="item.type === 'api'">
                    <el-button type="primary" class="addCollapse" size="small" @click="addResponseVariable(item)">添加响应出参映射</el-button>
                </div>

                <el-form label-width="auto" style="width: 100%" v-if="item.type === 'api'">
                    <el-collapse>
                        <el-collapse-item :name="paramIndex" v-for="(paramItem, paramIndex) in item.apiResponseList">
                            <template #title>
                                <div class="collapseTitle">
                                    <span>参数 {{(paramIndex + 1)}}</span>
                                    <el-button type="danger" plain size="small" style="margin-left: 20px" @click.stop="deleteResponseVariable(item, paramIndex)">删除</el-button>
                                </div>
                            </template>
                            <el-form-item label="参数名称">
                                <el-select v-model="paramItem.variableName" placeholder="参数名称" style="width: 100%">
                                    <el-option v-for="info in commonParam" :label="info.variableName" :value="info.variableName" />
                                </el-select>
                            </el-form-item>

                            <el-form-item label="参数值">
                                <el-input v-model="paramItem.variableValue" style="width: 100%" placeholder="参数值jsonPath"/>
                            </el-form-item>
                        </el-collapse-item>
                    </el-collapse>
                </el-form>


                <el-form-item label="路由跳转路径" v-if="item.type === 'route'">
                    <el-input v-model="item.routeTo" style="width: 100%"/>
                </el-form-item>

                <div style="display: flex; justify-content: center; align-items: center; margin-top: 3%;" v-if="item.type === 'route' && item.isAddBeforeThirdExec === false">
                    <el-button type="primary" class="addCollapse" size="small" @click="addRouteVariable(item)">添加路由参数</el-button>
                </div>

                <el-form label-width="auto" style="width: 100%" v-if="item.type === 'route'">
                    <el-collapse>
                        <el-collapse-item :name="paramIndex" v-for="(paramItem, paramIndex) in item.apiParamList">
                            <template #title>
                                <div class="collapseTitle">
                                    <span>参数 {{(paramIndex + 1)}}</span>
                                    <el-button type="danger" plain size="small" style="margin-left: 20px" @click.stop="deleteRouteVariable(item, paramIndex)">删除</el-button>
                                </div>
                            </template>
                            <el-form-item label="参数类型">
                                <el-radio-group v-model="paramItem.type">
                                    <el-radio label="custom">自定义</el-radio>
                                    <el-radio label="variable">关联变量</el-radio>
                                    <el-radio label="urlQuery">URL地址变量</el-radio>
                                </el-radio-group>
                            </el-form-item>
                            <el-form-item label="参数名称">
                                <el-input v-model="paramItem.variableName" style="width: 100%"/>
                            </el-form-item>
                            <el-form-item label="参数值" v-if="paramItem.type === 'custom'">
                                <el-input v-model="paramItem.variableValue" style="width: 100%">
                                    <template #prepend>
                                        <el-select v-model="paramItem.variableType" placeholder="Select" style="width: 115px">
                                            <el-option label="字符串" value="String" />
                                            <el-option label="数组" value="Array" />
                                            <el-option label="对象" value="Object" />
                                        </el-select>
                                    </template>
                                </el-input>
                            </el-form-item>

                            <el-form-item label="URL地址参数名称" v-if="paramItem.type === 'urlQuery'">
                                <el-input v-model="paramItem.variableValue" style="width: 100%" />
                            </el-form-item>

                            <el-form-item label="变量名称" v-if="paramItem.type === 'variable'">
                                <el-select v-model="paramItem.variableParamName" placeholder="变量名称" style="width: 100%">
                                    <el-option v-for="info in commonParam" :label="info.variableName" :value="info.variableName" />
                                </el-select>
                            </el-form-item>
                        </el-collapse-item>
                    </el-collapse>
                </el-form>

                <el-form-item label="跳转地址" v-if="item.type === 'windowRoute'">
                    <el-input v-model="item.windowRouteTo" style="width: 100%"/>
                </el-form-item>

                <el-form-item label="是否新开窗口" v-if="item.type === 'windowRoute'">
                    <el-radio-group v-model="item.isOpenNewWindow">
                        <el-radio :label="true">是</el-radio>
                        <el-radio :label="false">否</el-radio>
                    </el-radio-group>
                </el-form-item>

                <div style="display: flex; justify-content: center; align-items: center; margin-top: 3%;" v-if="item.type === 'windowRoute' && item.isAddBeforeThirdExec === false">
                    <el-button type="primary" class="addCollapse" size="small" @click="addWindowRouteVariable(item)">添加跳转参数</el-button>
                </div>

                <el-form label-width="auto" style="width: 100%" v-if="item.type === 'windowRoute'">
                    <el-collapse>
                        <el-collapse-item :name="paramIndex" v-for="(paramItem, paramIndex) in item.apiParamList">
                            <template #title>
                                <div class="collapseTitle">
                                    <span>参数 {{(paramIndex + 1)}}</span>
                                    <el-button type="danger" plain size="small" style="margin-left: 20px" @click.stop="deleteWindowRouteVariable(item, paramIndex)">删除</el-button>
                                </div>
                            </template>
                            <el-form-item label="参数类型">
                                <el-radio-group v-model="paramItem.type">
                                    <el-radio label="custom">自定义</el-radio>
                                    <el-radio label="variable">关联变量</el-radio>
                                    <el-radio label="urlQuery">URL地址变量</el-radio>
                                </el-radio-group>
                            </el-form-item>
                            <el-form-item label="参数名称">
                                <el-input v-model="paramItem.variableName" style="width: 100%"/>
                            </el-form-item>
                            <el-form-item label="参数值" v-if="paramItem.type === 'custom'">
                                <el-input v-model="paramItem.variableValue" style="width: 100%">
                                    <template #prepend>
                                        <el-select v-model="paramItem.variableType" placeholder="Select" style="width: 115px">
                                            <el-option label="字符串" value="String" />
                                            <el-option label="数组" value="Array" />
                                            <el-option label="对象" value="Object" />
                                        </el-select>
                                    </template>
                                </el-input>
                            </el-form-item>

                            <el-form-item label="URL地址参数名称" v-if="paramItem.type === 'urlQuery'">
                                <el-input v-model="paramItem.variableValue" style="width: 100%" />
                            </el-form-item>

                            <el-form-item label="变量名称" v-if="paramItem.type === 'variable'">
                                <el-select v-model="paramItem.variableParamName" placeholder="变量名称" style="width: 100%">
                                    <el-option v-for="info in commonParam" :label="info.variableName" :value="info.variableName" />
                                </el-select>
                            </el-form-item>
                        </el-collapse-item>
                    </el-collapse>
                </el-form>

                <el-form-item label="是否添加后置服务" v-if="item.type === 'api' || item.type === 'route' || item.type === 'windowRoute'">
                    <el-radio-group v-model="item.isAddAfterThirdExec">
                        <el-radio :label="true">是</el-radio>
                        <el-radio :label="false">否</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-divider v-if="item.isAddAfterThirdExec && (item.type === 'api' || item.type === 'route' || item.type === 'windowRoute')"></el-divider>
                <el-alert v-if="item.isAddAfterThirdExec && (item.type === 'api' || item.type === 'route' || item.type === 'windowRoute')" title="前置服务只对 服务调用 功能生效" type="info" center show-icon :closable="false"/>
                <br />
                <el-form-item label="三方服务编码" v-if="item.isAddAfterThirdExec && (item.type === 'api' || item.type === 'route' || item.type === 'windowRoute')">
                    <el-select v-model="item.afterThirdExecCode" placeholder="三方服务编码" style="width: 100%" clearable
                               @change="thirdExecAfterChange(item.afterThirdExecCode, item)"
                               @clear="thirdExecAfterClear(item)">
                        <el-option v-for="info in thirdExecList" :label="info.code" :value="info.code"/>
                    </el-select>
                </el-form-item>
                <el-form-item label="参数配置" v-if="item.isAddAfterThirdExec && (item.type === 'api' || item.type === 'route' || item.type === 'windowRoute')">
                    <el-table :data="item.afterExecParamJson ? item.afterExecParamJson : []" :border="true"
                              :stripe="true"
                              :show-overflow-tooltip="true"
                              :max-height="200"
                              style="width: 100%;">
                        <el-table-column prop="name" label="字段名称"></el-table-column>
                        <el-table-column prop="type" label="字段类型"></el-table-column>
                        <el-table-column prop="description" label="字段描述"></el-table-column>
                        <el-table-column prop="value" label="字段值">
                            <template #default="scope">
                                <el-input v-model="scope.row.showInfo" @click="valueClick(scope, item.afterExecParamJson)"/>
                            </template>
                        </el-table-column>
                    </el-table>
                </el-form-item>
                <el-divider v-if="item.isAddAfterThirdExec && (item.type === 'api' || item.type === 'route' || item.type === 'windowRoute')"></el-divider>
            </el-collapse-item>
        </el-collapse>
    </el-form>


    <el-dialog v-model="dialogVisible" title="参数配置" width="30%">
        <el-form>
            <el-form-item label="类型" label-width="20%">
                <el-radio-group v-model="formInfo.selectType">
                    <el-radio label="variable">关联变量</el-radio>
                    <el-radio label="urlParam">管理URL地址变量</el-radio>
                    <el-radio label="custom">自定义</el-radio>
                </el-radio-group>
            </el-form-item>
            <br />
            <el-form-item v-if="formInfo.selectType === 'custom'" label="值" label-width="20%">
                <el-input v-model="formInfo.customContent" />
            </el-form-item>
            <el-form-item v-if="formInfo.selectType === 'variable'" label="值" label-width="20%">
                <el-select v-model="formInfo.variableName" placeholder="变量名称" style="width: 100%">
                    <el-option v-for="info in commonParam" :label="info.variableName" :value="info.variableName" />
                </el-select>
            </el-form-item>
            <el-form-item v-if="formInfo.selectType === 'urlParam'" label="值" label-width="20%">
                <el-input v-model="formInfo.urlParamName" />
            </el-form-item>
        </el-form>
        <template #footer>
            <div class="dialog-footer">
                <el-button @click="dialogVisible = false">取消</el-button>
                <el-button type="primary" @click="submitDialog()">确认</el-button>
            </div>
        </template>
    </el-dialog>
</template>

<script name="CommonThirdServiceAction" setup lang="ts">
import {getThirdExec} from "@/request/lowcode";
import {computed, defineProps, ref} from "vue";
import {apiServiceInfoQuery, apiServiceInfoQueryByApplicationId} from "@/request/apiService";
import {applicationInfoQuery} from "@/request/service";

let props = defineProps(['actionList', 'commonParam']);

let actionList = computed(() => {
    let tempActionList = props['actionList'];
    tempActionList.forEach(item => {
        // 兼容历史数据，如果当前没有选择api服务调用的填充类型，则默认使用自定义
        if (!item.apiInfoType) {
            item.apiInfoType = "CUSTOM"
        }
    })
    return tempActionList
})
let commonParam = computed(() => {return props['commonParam']})

let thirdExecList = ref([]);
let dialogVisible = ref(false);
let formInfo = ref({selectType: "custom", customContent: "", variableName: "", urlParamName: ""});
let currentOperationIndex = ref(-1);
let dialogExecParamJson = ref([]);
let apiServiceTemplateList = ref([]);

// 查询三方服务列表
let param = {
    pageInfo: {
        pageIndex: 1,
        pageSize: 1000
    }
}
getThirdExec(param).then(res => {
    thirdExecList.value = res.data["dataList"];
})
if (actionList.value.length === 0) {
    actionList.value.push({
        isAsyncAction: false
    })
}

let templateProps = ref({
    lazy: true,
    async lazyLoad(node, resolve) {
        let nodes = [];
        const {level, value} = node
        if (level === 0) {
            // 查询应用列表
            let apiSearchData = {
                pageInfo: {
                    pageIndex: 1,
                    pageSize: 1000
                }
            }
            await applicationInfoQuery(apiSearchData).then(res => {
                let applicationList = res.data;
                for (let i = 0; i < applicationList.length; i++) {
                    nodes.push({
                        value: applicationList[i].id,
                        label: applicationList[i].applicationName,
                        leaf: level >= 2
                    })
                }
            })
        } else {
            // 查询模板列表
            let param = {
                applicationId: value
            }
            await apiServiceInfoQueryByApplicationId(param).then(res => {
                let dataList = res.data
                dataList.forEach(item => {
                    nodes.push({
                        value: item,
                        label: item.apiServiceName,
                        leaf: true
                    })
                })
            })
        }
        resolve(nodes)
    }
})

function deleteAction(index) {
    // 删除数组中的数据
    actionList.value.splice(index, 1);
}

function addRequestVariable(item) {
    if (!item.apiParamList) {
        item.apiParamList = []
    }
    let variableInfo = {variableName: "", variableValue: "", type: "custom", variableType: "String", variableParamName: ""}
    item.apiParamList.push(variableInfo)
}

function deleteRequestVariable(item, paramIndex) {
    // 删除数组中的数据
    item.apiParamList.splice(paramIndex, 1);
}

function addResponseVariable(item) {
    if (!item.apiResponseList) {
        item.apiResponseList = []
    }
    let variableInfo = {variableName: "", variableValue: ""}
    item.apiResponseList.push(variableInfo)
}

function deleteResponseVariable(item, paramIndex) {
    // 删除数组中的数据
    item.apiResponseList.splice(paramIndex, 1);
}

function addRouteVariable(item) {
    if (!item.apiParamList) {
        item.apiParamList = []
    }
    let variableInfo = {variableName: "", variableValue: "", type: "custom", variableType: "String", variableParamName: ""}
    item.apiParamList.push(variableInfo)
}

function deleteRouteVariable(item, paramIndex) {
    // 删除数组中的数据
    item.apiParamList.splice(paramIndex, 1);
}

function addWindowRouteVariable(item) {
    if (!item.apiParamList) {
        item.apiParamList = []
    }
    let variableInfo = {variableName: "", variableValue: "", type: "custom", variableType: "String", variableParamName: ""}
    item.apiParamList.push(variableInfo)
}

function deleteWindowRouteVariable(item, paramIndex) {
    // 删除数组中的数据
    item.apiParamList.splice(paramIndex, 1);
}

function valueClick(scope, execParamJson) {
    dialogExecParamJson.value = execParamJson;
    currentOperationIndex.value = scope.$index
    let row = scope.row
    if (row.execParamInfo) {
        formInfo.value = row.execParamInfo;
    } else {
        formInfo.value = {selectType: "custom", customContent: "", variableName: ""};
    }
    dialogVisible.value = true
}

function submitDialog() {
    dialogVisible.value = false
    let execParamJsonInfo = dialogExecParamJson.value[currentOperationIndex.value]
    execParamJsonInfo.execParamInfo = formInfo.value;
    if (execParamJsonInfo.execParamInfo.selectType === 'custom') {
        execParamJsonInfo.showInfo = execParamJsonInfo.execParamInfo.customContent
    } else {
        execParamJsonInfo.showInfo = "变量." + execParamJsonInfo.execParamInfo.variableName
    }
}

function thirdExecBeforeChange(code, item) {
    // 遍历所有列表，根据code查询出对应的execParam
    let execParam = "";
    for (let index = 0; index < thirdExecList.value.length; index++) {
        let info = thirdExecList.value[index]
        if (info.code === code) {
            execParam = info.execParam
            break
        }
    }
    if (execParam) {
        item.beforeExecParamJson = JSON.parse(execParam)
    } else {
        item.beforeExecParamJson = []
    }
}

function thirdExecAfterChange(code, item) {
    // 遍历所有列表，根据code查询出对应的execParam
    let execParam = "";
    for (let index = 0; index < thirdExecList.value.length; index++) {
        let info = thirdExecList.value[index]
        if (info.code === code) {
            execParam = info.execParam
            break
        }
    }
    if (execParam) {
        item.afterExecParamJson = JSON.parse(execParam)
    } else {
        item.afterExecParamJson = []
    }
}

function thirdExecBeforeClear(item) {
    item.beforeExecParamJson = []
}

function thirdExecAfterClear(item) {
    item.afterExecParamJson = []
}

function thirdExecRealChange(code, item) {
    // 遍历所有列表，根据code查询出对应的execParam
    let execParam = "";
    for (let index = 0; index < thirdExecList.value.length; index++) {
        let info = thirdExecList.value[index]
        if (info.code === code) {
            execParam = info.execParam
            break
        }
    }
    if (execParam) {
        item.realExecParamJson = JSON.parse(execParam)
    } else {
        item.realExecParamJson = []
    }
}

function thirdExecRealClear(item) {
    item.realExecParamJson = []
}

function templateListSearch() {
    let param = {
        pageInfo: {
            pageIndex: 1,
            pageSize: 1000
        }
    }
    apiServiceInfoQuery(param).then(res => {
        apiServiceTemplateList.value = res.data.dataList;
    })
}

function apiServiceTemplateChange(event, itemInfo) {
    let item = event[1]
    itemInfo.apiMethod = item.apiServiceMethod;
    itemInfo.apiPath = item.apiServiceUrl;
    itemInfo.apiType = item.apiServiceType;
    itemInfo.apiParamList = JSON.parse(item.apiServiceRequestContent)
    itemInfo.apiResponseList = JSON.parse(item.apiServiceResponseContent)
}
</script>

<style scoped lang="less">

</style>